<template>
  <div>
    <van-button @click="loading">开始加载</van-button>
    <van-button @click="$router.push({name: 'documentsWrite'})">去公文</van-button>
    <van-button @click="$router.go(-1)">回去 </van-button>
    <!-- <span>本页面已经call 'navBack'</span> -->
      <!-- <time-choose
      :start="start"
      :end="end"
       height="300px"
      :show.sync="datePickerVisible"
      @change="timeChange">
      <div slot="header">
        我是插槽 <br>
        我是插槽<br>
        我是插槽<br>
        我是插槽<br>
        我是插槽
      </div>
    </time-choose> -->
    <!-- <van-stepper v-model="value" step="0.01"  :show-plus="false" :show-minus="false"/>
    <van-button @click="call">打电话给 17313038862</van-button>
    <van-button @click="$router.push({name: 'documentshandle'})">跳转</van-button>
    <van-button @click="close">关闭webView</van-button> -->
    <!-- <van-button icon="arrow-left" @click="backToSchedule">返回日程</van-button>
    {{ start }} - {{ end }}
    <van-button @click="showPreviewBridge">调用Bridge 文件预览</van-button>
    <van-button @click="datePickerVisible = true">外部触发 时间选择开关</van-button>
    <van-button @click="showWord('http://cms.yuyankeji.cn/123.docx')">外部触发 文档预览开关</van-button>
    <van-button @click="showWord('http://cms.yuyankeji.cn/%E5%88%86%E5%8F%91.docx')">外部触发 文档预览开关2</van-button>
    <van-button @click="fileUrl = ''">外部触发 关闭文档预览</van-button> -->
    <!-- <van-button @click="$router.push({name: 'meetingDetail' , query: {id: '1'}})"></van-button> -->
    <!-- <word-preview v-if="fileUrl" :fileUrl="fileUrl"/> -->
    <!-- <span>下面点击后不改url就回不来 别点</span> -->
    <!-- <forms ref="forms" :form="form" :table="table"></forms>
    <van-button @click="$refs.forms.getFormData()">获取值</van-button> -->
    <!-- <div class="nav-container">
      <van-tabs sticky animated swipeable color="#2E79FF" @click="setSrollTop" v-model="activeTab">
        <van-tab v-for="(item, index) in tabs" :key="`${index}tab页`" :title="item.name">
          <div class="tab-panel" :ref="item.data">
            <van-pull-refresh v-model="refreshLoading" @refresh="getDataList(item.data, item.page, item.type, item.finished, true)">
              <template v-if="getDataFiled(item.data).length == 0">
                <div class="no-data-img">
                  <img src="../assets/meeting/no_meeting.png">
                  <p>暂无投票</p>
                </div>
              </template>
              <van-list
                v-show="getDataFiled(item.data).length > 0"
                v-model="isLoading"
                :finished="getDataFiled(item.finished)"
                finished-text="没有更多数据了">
                <van-card  v-for="(itemInner, indexInner) in getDataFiled(item.data)" :index="`${indexInner}投票`"  @click.stop="itemClick(itemInner)">
                  <div slot="title">
                    <p class="card-title van-multi-ellipsis--l2">
                      <van-tag color="#F5A703" size="large" text-color="#fff" v-if="itemInner.is_pick == 1">已参与</van-tag>
                      {{ itemInner.title }}
                    </p>
                  </div>
                  <div slot="desc">
                    <p class="card-desc">
                      <span>发起人: {{ itemInner.user_name }}</span>
                      <span>{{ itemInner.date }}</span>
                    </p>
                  </div>
                </van-card>
              </van-list>
            </van-pull-refresh>
          </div>
        </van-tab>
      </van-tabs>
    </div>
    <form-file ref="formFile" :files="attachment"></form-file>
    <van-button type="primary" @click="confirms">提交</van-button>
    <div v-bind:class="{ expansion : active }" class="card-mid">
      {{message}}
    </div>
    <span style="color: green;" @click="expanse">{{expanseText}}</span> -->
    <van-button @click="timeshow = true">按钮 </van-button>
    <van-popup v-model="timeshow" position="bottom">
      <new-time :values="value"></new-time>
    </van-popup>
  </div>
</template>

<style type="text/css">
  .van-toast {
    background: transparent!important;
  }  
</style>

<script>
  // @ is an alias to /src
  import timeChoose from '@/components/TimeChoose.vue'
  import forms from '@/components/Forms.vue'
  import formFile from '@/components/FormFile.vue'
  import newTime from '@/components/NewTime.vue'
  export default {
    components: {
      'time-choose': timeChoose,
      'forms': forms,
      'form-file': formFile,
      'new-time' : newTime
    },
    data () {
      return {
        value: '',
        start: '',
        end: '',
        datePickerVisible: false,
        fileUrl: '',
        form: [],
        table: [],
        attachment:[{
          form_name:'法律意见书附件',
          checked: '1',
          files: []
        },{
          form_name:'电子合同附件',
          checked: '0',
          files: []
        },{
          form_name:'会议纪要附件',
          checked: '1',
          files: []
        }],
        message:"这是一段很长很长很长非常长特别长的文字，再复制一段文字：解释：这里的card-mid是原有的样式，v-bind:class里的expansion是转换后的样式。里面的active如果值为真的话，就会覆盖原有的样式，也就是说，展开的时候我们不限制元素的高度，将全部文本展示出来为样式一，收起的时候我们需要点击一下吧，就可以实现样式转换，显示固定高度的样式二。",
        active: false,
        expanseText: '收起',
        timeshow: false,
        value: '2020-08-01 1'
      }
    },
    activated() {
      // this.$axios.post(`${this.$common.basePath}workclass.php`, {
      //   do: 'workclassaddlist',
      //   tplid: 8913,
      //   workid: 1477,
      //   typeid: 11
      // }).then(res => {
      //   this.form = res.data.rowdb
      //   this.table = res.data.results
      // })
      if(this.$route.query.from && this.$route.query.from == 'origin') {
        console.log('来源是原生的~')
      } else {
        this.$bridge.callHandler('navBack')
      }
      this.$bridge.callHandler('navTitle', {title: 'test2'})
    },
    mounted() {
      this.$axios.post(`${this.$common.basePath}workclass.php`, {
        do: 'workclassaddlist',
        tplid: "8913",
        workid: 1736,
        typeid: '1011',
      }).then(res => {
        this.form = res.data.rowdb
        this.table = res.data.results
      })
    },
    methods: {
      loading() {
        this.$toast({
          message: '加载中',
          icon: require('../assets/loading.gif'),
        })
      },
      call () {
        this.$bridge.callHandler('makePhoneCall', {tel: 17313038862}, (data) => {
          console.log("已调用 backToSchedule 方法")
        })
      },
      close () {
        this.$bridge.callHandler('close', {}, (data) => {
          console.log("已调用 backToSchedule 方法")
        })
      },
      timeChange(e) {
        this.start = e.start
        this.end = e.end
      },
      showWord(url) {
        this.fileUrl = encodeURI(url)
      },
      /**
       * 返回至原生日程界面
       * @return {[type]} [description]
       */
      backToSchedule() {
        this.$bridge.callHandler('backToSchedule', {}, (data) => {
          console.log("已调用 backToSchedule 方法")
        })
      },
      /**
       * 调用原生进行文件预览
       * @return {[type]} [description]
       */
      showPreviewBridge() {
        this.$bridge.callHandler('showPreview', {
          name: "这是固定的文件名.xxx",
          url: 'http://cms.yuyankeji.cn/%E5%88%86%E5%8F%91.docx',
          type: '1'
        }, () => {
          console.log('showPreview事件调用完成')
        })
      },
      /**
       *  附件查看提交信息 
       */
      confirms() {
        let saveForm = this.$refs.formFile.getFormData();
        console.log(saveForm)
      },
      /**
       * 文字展开
       * @return {[type]} [description]
       */
      expanse() {
        if (this.expanseText == '展开') {
          this.active = false
          this.expanseText = '收起'
        } else {
          this.active = true
          this.expanseText = '展开'
        }
      }
    }
  }
</script>
<style type="text/css">
  .expansion{
    white-space:pre-line;
    overflow: hidden;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }
</style>
